.central {
  border: 1.5px solid gray;
  width: 95%;
  margin: 2%;
  height: 75%;
  margin-top: 10%;
  overflow-y: auto;
}

.roguelike-intro-img {
  margin-top: 5%;
  margin-bottom: 3%;
  width: 95%;
  height: auto;
}

.entry {
  font-size: 120%;
}

.difficulty-selection {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  margin-top: 10%;
  width: 80%;
  height: 40%;
}

.difficulty-button {
  font-size: 105%;
  height: 30%;
  margin: 5% 5% 5% 5%;
  padding: 0% 5% 0% 5%;
}

.introduce-button, .back-button {
  margin-top: 5%;
  margin-left: 10%;
  font-size: 98%;
  padding: 2.5%;
}

.introduce-button {
  margin-left: 5%;
}

.refresh-picks, .refresh-shop {
  font-size: 105%;
  padding: 1%;
  margin-left: 50%;
  margin-top: 1%;
}

.refresh-shop {
  margin-bottom: 5%;
}

.pick {
  display: inline-block;
  vertical-align: top;

  border: solid 2px gray;
  width: 30%;
  height: 60%;
  margin: 1%;
  margin-top: 5%;
}

.pick-button {
  padding: 5%;
  font-size: 105%;
  width: 80%;
  margin: 5%;
}

.skip-picks {
  margin-top: 2%;
  font-size: 105%;
  padding: 2%;
}

.roguelike-tab {
  font-size: 105%;
  padding: 2%;
  margin: 1%;
  margin-bottom: 0%;
}

.gold-wrapper {
  float: right;
  width: auto;
  height: 7%;
  margin: 2%;
  border: 1px solid gray;
  font-size: 120%;
  background-color: rgba(0, 0, 0, .55);
}

.shop-items, .relics {
  display: flex;
  /* border: 1px solid gray; */
  align-items: center;
  /* justify-content: center; */

  flex-direction: column;
  overflow-x: auto;
  margin: auto;
  width: 98%;
  height: 75%;

}

.relics {
  height: 60%;
}

.shop-item-img-container {
  height: 90%;
  width: 25%; 
  margin: auto;
  border: 1px solid gray;
}

.shop-item-img {
  height: 100%;
  width: 100%;
}

.shop-item-info {
  width: 45%;
  height: 90%;
  border: 1px solid gray;
  margin: auto;
  font-size: 80%;
  overflow-y: hidden;
}

.shop-item-desc {
  width: 98%;
  margin: auto;
  /* font-size: 70%; */
}

.shop-item {
  flex-shrink: 0;
  display: flex;
  width: 98%;
  height: 28%;
  margin: 1% 1% 1% 1%;

  border: 2px solid gray;

  vertical-align: top;
  /* overflow-y: hidden; */
}

.buy {
  font-size: 105%;
  width: 20%;
  height: 50%;
  margin: auto;
}

.heijiao-container-2 {
  display: inline-block;
  margin: 10% 2% 2% 2%;
  width: 40%;
  height: 65%;
}

.heijiao-img-2 {
  height: 100%;
  width: auto;
  margin-left: -35%;

}

.counter-container {
  display: inline-block;
  margin: 10% 2% 2% 2%;
  vertical-align: top;
  height: 65%;
  width: 50%;
}

.battle-count-title {
  margin-top: 40%;
  font-size: 200%;
  font-weight: 420;
}

.battle-count {
  color: #4682B4;
}

.roguelike-operations {
  display: flex;
  margin: 2% 2% 2% 2%;
  width: 95%;
  height: 20%;
}

.roguelike-operation {
  height: 60%;
  width: 30%;
  font-size: 100%;
  margin: 5% 1% 2% 1%;
}

.finish-pick {
  margin-top: 35%;
  font-size: 150%;
}

.result-info {
  margin-top: 10%;
  font-size: 180%;
  font-weight: 400;
  line-height: 155%;
}

.result-quote, .result-win-quote {
  font-size: 180%;
  font-weight: 450;
  color: #096dd9;
  margin-top: 5%;
  margin-bottom: 5%;
}

.lose-img-container {
  height: 35%;
  width: 98%;
}

.lose-img {
  /* width: 100%; */
  /* height: auto; */
  height: 100%;
  width: auto;
}

.result-img-container {
  height: 38.1%;
  width: 98%;
  overflow: hidden;
}

.result-img {
  height: 100%;
  width: auto;
}

.result-win-quote {
  color: #fa541c;
  margin-top: 2%;
  margin-bottom: 2%;
  font-size: 160%;
}

.slam {
  font-size: 250%;
  font-weight: 450;
  color: #f5222d;
  margin-top: 3%;
  margin-left: 12%;
}

.gold-gained {
  font-size: 500%;
  color:#fa8c16;
}

.continue-btn, .endrun-btn {
  width: 30%;
  height: 10%;
  font-size: 120%;
  margin-top: 5%;
}

.weekly-btn {
  height: 10%;
  font-size: 125%;
  margin: 1% 1.5% 1% 1.5%;
  padding: 1% 3% 1% 3%;
}

.endrun-btn {
  width: auto;
  padding-left: 4%;
  padding-right: 4%;
  margin-top: 0%;
}

.ascension {
  font-size: 200%;
  font-weight: 500;
  color: #ff7a45;
  margin-top: 10%;
  margin-left: 12%;
  margin-bottom: 5%;
}

.illust-info {
  color: gray;
  font-size: 80%;
  margin-top: 5%;
}

.roguelike-deck-selection-title {
  margin-top: 2%;
}

.roguelike-deck-selection {
  width: 96%;
  margin-left: 2.5%;
  height: 90%;
  /* border: 1px solid gray; */
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

.roguelike-deck-repr {
  width: 98%;
  height: 38%;
  /* border: 0.8px solid gray; */
}

.roguelike-deck-repr-name {
  margin-bottom: 0%;
  font-size: 80%;
  color: #0d0d0d;
}

.roguelike-deck-repr-button {
  width: 25%;
  margin-left: 2%;
  margin-right: 2%;
  padding-top: 1%;
  padding-bottom: 1%;
  font-size: 102%;
}